import { BoilingCoolingItem } from '@/services/boilingCooling';
import type { ProFormInstance } from '@ant-design/pro-components';
import {
  ModalForm,
  ProFormDatePicker,
  ProFormDigit,
  ProFormText,
} from '@ant-design/pro-components';
import { useRef } from 'react';

export type MaterialModalProps = {
  visible: boolean;
  onVisibleChange: (visible: boolean) => void;
  initialValues?: Partial<BoilingCoolingItem>;
  onSuccess: () => void;
};

const BoilingCoolingModal: React.FC<MaterialModalProps> = ({
  visible,
  onVisibleChange,
  initialValues,
}) => {
  const formRef = useRef<ProFormInstance>();

  return (
    <ModalForm<Omit<BoilingCoolingItem, 'id' | 'sales'>>
      formRef={formRef}
      title={initialValues ? '编辑信息' : '新增信息'}
      open={visible}
      onOpenChange={onVisibleChange}
      modalProps={{
        destroyOnClose: true,
        maskClosable: false,
      }}
      initialValues={initialValues}
      preserve={false}
      onFinish={async (values) => {
        console.log(values);
      }}
    >
      <ProFormText
        name="name"
        label="原料名称"
        placeholder="请输入原料名称"
        rules={[{ required: true, message: '请输入原料名称' }]}
      />

      <ProFormText
        name="principal"
        label="负责人"
        placeholder="请输入负责人姓名"
        rules={[{ required: true, message: '请输入负责人姓名' }]}
      />
      <ProFormText
        name="place"
        label="处理地点"
        placeholder="请输入处理地点"
        rules={[{ required: true, message: '请输入处理地点' }]}
      />
      <ProFormDigit
        name="weight"
        label="数量(KG)"
        placeholder="请输入数量"
        min={0}
        rules={[{ required: true, message: '请输入数量' }]}
      />
      <ProFormText
        name="quality"
        label="合格情况"
        placeholder="请输入合格情况"
        rules={[{ required: true, message: '请输入合格情况' }]}
      />
      <ProFormDatePicker width="md" name="date" label="处理时间" />
    </ModalForm>
  );
};

export default BoilingCoolingModal;
